import React from "react";
import { useSelector, useDispatch } from "react-redux";

const App = () => {
  // 组件里面获取仓库数据要用get方法
  const count = useSelector((state) => {
    // console.log(state.counter.count);
    return state.getIn(["counter", "count"]);
  });
  const name = useSelector((state) => state.getIn(["name", "name"]));
  const dispatch = useDispatch();

  return (
    <>
      <h2>redux-immutable</h2>
      <button onClick={() => dispatch({ type: "decrement" })}>-</button>
      <span>{count}</span>
      <button onClick={() => dispatch({ type: "increment" })}>+</button>

      <hr />

      <p>{name}</p>
      <button onClick={() => dispatch({ type: "changename", name: "lisi" })}>
        btn
      </button>
    </>
  );
};

export default App;
